import React from 'react';
import {Link, Route, Redirect, Switch} from 'react-router-dom'
import LazyRoute from './LazyRoute'

import {content} from './styles'

import Users from 'bundle-loader?lazy!./contents/Users/index'
import Datas from 'bundle-loader?lazy!./contents/Datas/index'
import Welcome from 'bundle-loader?lazy!./contents/Welcome'

const RouteConfig = [
    {
        path: '/users',
        component: Users,
    },
    {
        path: '/datas',
        component: Datas,
    }
];

const Routes = React.createClass({
    render() {
        return <div>
            <Switch>
                {RouteConfig.map(function (ele, index) {
                    return <LazyRoute key={index} path={ele.path} component={ele.component}/>
                })}
                <LazyRoute component={Welcome}/>
            </Switch>
        </div>
    }
});

class Content extends React.Component {

    render() {
        return <div style={content}>
            <Routes />
        </div>
    }
}

export default Content;
